<!-- 放弃入职模态框  -->
<template>
	<view>
		<view class="cu-bar bg-white margin-top">
			<view class="action">
				<text class="cuIcon-title text-orange "></text> 对话窗口
			</view>
			<view class="action">
				<!-- 需要用的地方换参数直接用 -->
				<button class="cu-btn bg-green shadow" @tap="showModal" data-target="DialogModal1">Dialog</button>
			</view>
		</view>
		<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
			<view class="cu-dialog set-width">
				<view class="cu-bar justify-end changebgc">
					<view class="content text-white top-title">放弃入职</view>
					<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-white"></text>
					</view>
				</view>
				<view class="set-padding">
					<view class="flex flex-mine">
						<view class="title-h2">姓名:</view>
						<view class="detail-h2">张明</view>
					</view>
					<view class="flex-mine">
						<view class="detail-h2">确定该人才未入职吗？确认未入职后，该人才信息将进入简历库。</view>
					</view>
				</view>
				<view class="cu-bar bg-white set-bottom">
					<view class="flex">
						<view class="set-btn1" @tap="hideModal">取消</view>
						<view class="cu-btn set-btn2" @tap="hideModal">确定</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				modalName: null,
			}
		},
		methods:{
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target
			},
			hideModal(e) {
				this.modalName = null
			},
		}
	}
</script>

<style scoped lang="stylus">
	.top-title{
		margin-right:350upx;
		font-size:28upx;
		font-weight:400;
		color:rgba(255,255,255,1);
	}
	.set-width{
		width:540upx;
	}
	.set-padding{
		padding:30upx 28upx 30upx 30upx;
	}
	.changebgc{
		background:#4A90E2;
		height:70upx!important;
	}
	.flex-mine{
		margin-bottom:30upx;
		align-items:center;
	}
	.title-h2{
		font-size:30upx;
		color:#666;
	}
	.detail-h2{
		text-align:left;
		font-size:30upx;
		color:#333;
		font-weight:400;
	}
	.inp-model{
		height:60upx;
		width:318upx;
		background:#F3F3F3;
		line-height:60upx;
		justify-content:space-between;
		padding:0 26upx;
		font-size:30upx;
		color:#333;
	}
	.set-bottom{
		height:92upx;
		line-height:92upx;
	}
	.set-btn1{
		height:92upx;
		line-height:92upx;
		background:#fff;
		border-right:1px solid #D8D8D8;
		border-top:1px solid #D8D8D8;
		width:270upx;
		font-size:30upx;
		text-align:center;
		color:#333;
	}
	.set-btn2{
		height:92upx;
		line-height:92upx;
		background:#fff;
		width:268upx;
		border-top:1px solid #D8D8D8;
		font-size:30upx;
		text-align:center;
		color:#4A90E2;
	}
</style>
